<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/lib/layui/css/layui.css">
    <script type="text/javascript" src="/lib/layui/layui.js"></script>
    <style>
        *{
            padding:0;
            margin:0;
        }
        .bing{
            width:400px;
            height:300px;
            border:1px solid #ccc;
        }
        .table{
            border:1px solid #f00;
        }
        .table h3{
            text-align: center;
        }
    </style>
</head>
<body>

<h1>〇、总体统计</h1>
<table>
    <tr>
    </tr>
    <tr>
    </tr>
</table>


<h1>一、項目分析</h1>
<table>
    <tr>
        <td class="bing" id="prjCountGroupByScale"></td>
        <td class="bing" id="purpose"></td>
        <td class="bing" id="zbAnnualTrend"></td>

    </tr>
    <tr>
        <td>
            <div class="table layui-form" style="width:520px;">
                <h3>各市项目分布</h3>
                <table class="layui-table">
                    <colgroup>
                        <col width="60">
                        <col width="100">
                        <col width="100">
                        <col width="130">
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>地区名</th>
                        <th>项目数</th>
                        <th>装配式建筑个数</th>
                        <th>被动房建筑个数</th>
                    </tr>
                    </thead>
                    <tbody id="projectFb"></tbody>
                </table>
            </div>
        </td>
    </tr>
</table>


<h1>二、質量巡查</h1>
<table>
    <tr>
        <td class="bing" id=""><h3>今日巡查：问题数/巡查数</h3></td>
        <td class="bing" id=""></td>
        <td class="bing" id=""></td>
    </tr>
    <tr>
        <td class="bing" id="qlyInsCountGroupByStatus"></td>
        <td class="bing" id="queCountGroupByLevel"></td>
        <td class="bing" id="queCountGroupByType"></td>
    </tr>
    <tr>
        <td><div class="table layui-form" style="width:400px;">
            <h3>各市质量巡查次数排名</h3>
            <table class="layui-table">
                <colgroup>
                    <col width="60">
                    <col>
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <th>序号</th>
                    <th>地区名</th>
                    <th>巡查次数</th>
                </tr>
                </thead>
                <tbody id="xuncha"></tbody>
            </table>
        </div></td>
        <td><div class="table layui-form" style="width:520px;">
            <h3>各市超期未整改排名</h3>
            <table class="layui-table">
                <colgroup>
                    <col width="60">
                    <col width="140">
                    <col width="140">
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <th>序号</th>
                    <th>单位/地区名称</th>
                    <th>超期未整改数量</th>
                    <th>平均超期时长（天）</th>
                </tr>
                </thead>
                <tbody id="overtime"></tbody>
            </table>
        </div></td>

        <td><div class="table layui-form" style="width:520px;">
            <h3>施工单位超期未整改排名</h3>
            <table class="layui-table">
                <colgroup>
                    <col width="60">
                    <col>
                    <col>
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <th>序号</th>
                    <th>单位/地区名称</th>
                    <th>超期未整改数量</th>
                    <th>平均超期时长（天）</th>
                </tr>
                </thead>
                <tbody id="sgdwovertime"></tbody>
            </table>
        </div></td>
    </tr>
</table>


<h1>三、質量驗收</h1>
<table>
    <tr>
        <td class="bing" id="qlyAccCountGroupByType"></td>
        <td>
            <div class="table" style="width:900px;">
                <h3>各市质量验收类型综合统计排名</h3>
                <table id="dataList" lay-filter="test"></table>
            </div>
        </td>
    </tr>
</table>

<h1>四、竣工驗收分析</h1>
<table>
    <tr>
        <td>
            <div class="table" style="width:700px;">
                <h3>各市质量巡查次数排名</h3>
                <table id="zlpm" lay-filter="test"></table>
            </div>
        </td>
    </tr>
</table>

<h1>五、企業分析(略)</h1>
<table>
    <tr>
        <td class="bing" id="yearPrjCountOfCompany"></td>
        <td>
            <div class="table" style="width:500px;">
                <h3>各企业在建项目数排名</h3>
                <table id="zlys" lay-filter="test"></table>
            </div>
        </td>
        <td>
            <div class="table" style="width:500px;">
                <h3>各市在建项目数排名</h3>
                <table id="szjpm" lay-filter="test"></table>
            </div>
        </td>
    </tr>
</table>












<script src="/static/js/main.js"></script>
<script src="/static/js/echarts.min.js"></script>
<script>
    layui.use(['jquery','form', 'configureCom', 'configure', 'echartsCom','table'], function () {
        var $ = layui.jquery;
        var table = layui.table;
        var form = layui.form;
        var configureCom = layui.configureCom;
        var echartsCom = layui.echartsCom;


        var baseQueryData = {
            "provinceNum": "130000",
            "years": "2001,2010-2020,2021"
        };


        //工程规模分析--饼图
        var myChart1 = echarts.init(document.getElementById('prjCountGroupByScale'));

        configureCom.postAjax('/api/report/prj/prjCountGroupByScale',baseQueryData).then(function(res){
            echartsCom.bing('工程规模分析',res.data).then(function(option){
                myChart1.setOption(option);
            });
        });
        //工程用途分析 - 默认:饼图
        var myChart2 = echarts.init(document.getElementById('purpose'));

        configureCom.postAjax('/api/report/prj/purpose',baseQueryData).then(function(res){
            echartsCom.bing('工程用途分析',res.data).then(function(option){
                myChart2.setOption(option);
            });
        });
        //各市项目分布--表格
        configureCom.postAjax('/api/report/prj/distribute',baseQueryData).then(function(res){
            var html = '';
            var data = res.data;
            $.each(data, function(i, item){
               html += '<tr>' +
                   '        <td>'+(i+1)+'</td>' +
                   '        <td>'+item.district+'</td>' +
                   '        <td>'+item.prjCount+'</td>' +
                   '        <td>'+item.zpsCount+'</td>' +
                   '        <td>'+item.bdfCount+'</td>' +
                   '   </tr>'
            });
            $('#projectFb').html(html);
        });
        //省级 - 装配式Z、被动房B 建筑走势trend - 折线图
        var myChart3 = echarts.init(document.getElementById('zbAnnualTrend'));
        configureCom.postAjax('/api/report/prj/zbAnnualTrend',baseQueryData).then(function(res){
            var data = res.data;
            var legend = [];
            $.each(data,function(index, item){
                legend.push(item.name);
            });
            var xseries = [];//x轴
            $.each(data[0].data,function(index,item){
                xseries.push(item.name);
            });
            var series = [];
            $.each(data,function(i, item){
                var a = {};
                a.type = 'line';
                a.name = item.name;
                var arr = [];
                $.each(item.data,function(j,val){
                    arr.push(val.value);
                });
                a.data = arr;
                series.push(a);
            });

            echartsCom.xian('省级 - 装配式Z、被动房B 建筑走势', xseries, series).then(function(option){
                myChart3.setOption(option);
            });
        });
        ///各市超期未整改排名 - 默认:表格
        configureCom.postAjax('/api/report/qly/ins/cityOverdueRanking',baseQueryData).then(function(res){
            var html = '';
            var data = res.data;
            $.each(data, function(i, item){
                html += '<tr>' +
                    '        <td>'+(i+1)+'</td>' +
                    '        <td>'+item.name+'</td>' +
                    '        <td>'+item.overdueCount+'</td>' +
                    '        <td>'+item.avgOverdueDays+'</td>' +
                    '   </tr>'
            });
            $('#overtime').html(html);
        });
        //各市质量巡查次数排名 - 默认:表格
        configureCom.postAjax('/api/report/qly/ins/qlyInsCountGroupByCity',baseQueryData).then(function(res){
            var html = '';
            var data = res.data;
            $.each(data, function(i, item){
                html += '<tr>' +
                    '        <td>'+(i+1)+'</td>' +
                    '        <td>'+item.district+'</td>' +
                    '        <td>'+item.qlyInsCount+'</td>' +
                    '   </tr>'
            });
            $('#xuncha').html(html);
        });
        //施工单位超期未整改排名 - 默认:表格
        configureCom.postAjax('/api/report/qly/ins/sgdwOverdueRanking',baseQueryData).then(function(res){
            var html = '';
            var data = res.data;
            $.each(data, function(i, item){
                html += '<tr>' +
                    '        <td>'+(i+1)+'</td>' +
                    '        <td>'+item.name+'</td>' +
                    '        <td>'+item.overdueCount+'</td>' +
                    '        <td>'+item.avgOverdueDays+'</td>' +
                    '   </tr>'
            });
            $('#sgdwovertime').html(html);
        });
        //隐患状态等级占比 - 默认:饼图
        var myChart4 = echarts.init(document.getElementById('qlyInsCountGroupByStatus'));
        configureCom.postAjax('/api/report/qly/ins/qlyInsCountGroupByStatus',baseQueryData).then(function(res){
            echartsCom.bing('问题状态',res.data).then(function(option){
                myChart4.setOption(option);
            });
        });
        //质量问题等级占比 - 默认:饼图
        var myChart5 = echarts.init(document.getElementById('queCountGroupByLevel'));
        configureCom.postAjax('/api/report/qly/ins/queCountGroupByLevel',baseQueryData).then(function(res){
            echartsCom.bing('问题等级',res.data).then(function(option){
                myChart5.setOption(option);
            });
        });
        //质量问题类型占比 - 默认:饼图
        var myChart6 = echarts.init(document.getElementById('queCountGroupByType'));
        configureCom.postAjax('/api/report/qly/ins/queCountGroupByType',baseQueryData).then(function(res){
            echartsCom.bing('问题类型',res.data).then(function(option){
                myChart6.setOption(option);
            });
        });
        //验收类型统计 - 默认:柱状图
        var myChart7 = echarts.init(document.getElementById('qlyAccCountGroupByType'));
        configureCom.postAjax('/api/report/qly/acc/qlyAccCountGroupByType',baseQueryData).then(function(res){
            var data = res.data;
            var xArr = [];
            $.each(data,function(i, item){
               xArr.push(item.name);
            });
            var yArr = [];
            $.each(data,function(i, item){
                yArr.push(item.value);
            });
            echartsCom.zhu( '验收类型统计',xArr, '验收类型统计', yArr).then(function(option){
                myChart7.setOption(option);
            });
        });
        //各市质量验收类型综合统计排名 - 默认:表格
        var cols = [[ //表头
            {type:'numbers',title:'序号'},
            {field: 'name', title: '单位名称/地区名称'},
            {field: 'djgcCount', title: '地基工程'},
            {field: 'fsgcCount', title: '防水工程'},
            {field: 'gjybgcCount',width:120, title: '钢筋隐蔽工程'},
            {field: 'hntgcCount', title: '混凝土工程'},
            {field: 'wmgcCount', title: '屋面工程'},
            {field: 'otherCount',width:90, title: '其他'},
            {field: 'sum',width:90, title: '总计'}
        ]];
        configureCom.newtableRenderNoPage('#dataList', '/api/report/qly/acc/cityRanking','',cols);
        //各企业在建项目数排名 - 默认:表格
        var cols = [[ //表头
            {type:'numbers',title:'序号'},
            {field: 'name', title: '企业名称'},
            {field: 'count', title: '在建项目数'}
        ]];
        configureCom.newtableRenderNoPage('#zlys', '/api/report/company/prjCountInConstructionCompanyRanking','',cols);

        //各市在建项目数排名 - 默认:表格
        var cols = [[ //表头
            {type:'numbers',title:'序号'},
            {field: 'name', title: '企业名称'},
            {field: 'count', title: '在建项目数'}
        ]];
        configureCom.newtableRenderNoPage('#szjpm', '/api/report/company/prjCountUnderConstructionCityRanking','',cols);

        //各市在建项目数排名 - 默认:表格
        var cols = [[ //表头
            {type:'numbers',title:'序号'},
            {field: 'district', title: '地区名'},
            {field: 'cptAccCount', title: '验收总次数'},
            {field: 'cptAccArea', title: '竣工面积（m2）'},
            {field: 'oncePassRate', title: '验收一次性通过次数'},
            {field: 'oncePassRate', title: '验收一次性通过率 (*100)%'}
        ]];
        configureCom.newtableRenderNoPage('#zlpm', '/api/report/cpt/acc/distribute',baseQueryData,cols);


        //各企业年度项目数
        var myChart8 = echarts.init(document.getElementById('yearPrjCountOfCompany'));
        configureCom.postAjax('/api/report/company/yearPrjCountOfCompany','').then(function(res){
            var data = res.data;
            var series = [];
            var xdata = [];
            $.each(data[0].data,function(i,item){
                xdata.push(item.name);
            });
            $.each(data,function(i, item){
                var a = {};
                a.type = 'line';
                a.name = item.name;
                var arr = [];
                $.each(item.data,function(j,val){
                    arr.push(val.value);
                });
                a.data = arr;
                series.push(a);
            });
            echartsCom.xian( '各企业年度项目数', xdata, series).then(function(option){
                myChart8.setOption(option);
            });
        });

    });

</script>
</body>
</html>